
<template>
    <div>
        <el-button type="primary" @click="dialogFormVisible = true">新增</el-button>
        <el-table :data="list" style="width: 100%">
            <el-table-column prop="name" label="姓名" width="180"></el-table-column>
            <el-table-column prop="score" label=" 项分" width="180"></el-table-column>
        </el-table>

        
        <el-dialog title="小组打分" :visible.sync="dialogFormVisible">
        <el-form >
            <el-select v-model="personalScore.personalName" filterable placeholder="请选择">
                <el-option
                v-for="item in options"
                :key="item.value"
                :label="item.label"
                :value="item.value">
                </el-option>
            </el-select>
            <el-form :inline="true" class="demo-form-inline">
            <el-form-item label="内容">
                <el-input-number v-model="personalScore.personalScoreList[0].score" @change="handleChange" :min="1" :max="50" label="进度"/>
                <el-input v-model="personalScore.personalScoreList[0].content" placeholder="内容精准"></el-input>
            </el-form-item>
            <el-form-item label="表达">
                <el-input-number v-model="personalScore.personalScoreList[1].score" @change="handleChange" :min="1" :max="50" label="文档"/>
                <el-input v-model="personalScore.personalScoreList[1].content" placeholder="表达"></el-input>
            </el-form-item>                     
                                  
            </el-form>           
        </el-form>

        <div slot="footer" class="dialog-footer">
            <el-button @click="dialogFormVisible = false">取 消</el-button>
            <el-button type="primary" @click="save()">确 定</el-button>
        </div>
        </el-dialog> 
    </div>
</template>
<script>
import scoreApi from '@/api/score'

export default {
    data(){
        return {
            list:[],
            dialogFormVisible:false,
            personalScore:{
                personalScoreList:[
                    {optionId:6,score:50,content:""},
                    {optionId:7,score:50,content:""}
                ],
            },//组合实体类
            num: 50,
            options: [],
                    value: ''            
                    }
    },
    created(){
        this.fetchData();
    },
    methods:{
        fetchData(){
            scoreApi.personalScoresByUser().then(response => {
                this.list=response.data;
            });
            scoreApi.personalList().then(response => {
                this.options=response.data;
            });

        },
        handleChange(value) {
        },
        save(){
            scoreApi.addPerson(this.personalScore).then(response => {
                this.dialogFormVisible = false;
                this.$message({
                    message: response.message,
                    type: (response.flag?'success':'error')
                });                
                this.fetchData();
            })
        }
    }
}
</script>